.commit-more-info-panel {
  position: fixed;
  top: 68px !important;
  z-index: 101;
  overflow: hidden;
  bottom: 0;
  right: 0;
  width: 440px;
  background: #fff;
  box-shadow: -2px 0 4px 0 rgba(0, 0, 0, 0.1);
  border-left: 1px solid $gray-03;
  display: flex;
  flex-direction: column;
  .commit-base-info {
    padding: 20px;
    border-bottom: 1px solid $gray-02;
    .base-info-title {
      line-height: 20px;
      font-size: 14px;
      color: $gray-08;
    }
    .base-info-type {
      display: flex;
      align-items: center;
      margin-top: 16px;
      .type-name {
        text-align: left;
        line-height: 20px;
        font-size: 14px;
        color: $gray-06;
        margin-right: 20px;
      }
    }
  }
  .commit-comment-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    .comment-info-title {
      line-height: 24px;
      font-size: 14px;
      color: $gray-08;
    }
    .top-switch {
      padding: 10px 0;
    }
    &-list {
      flex: 1;
      overflow-y: auto;
      margin-left: -10px;
      margin-right: -20px;
      padding-left: 10px;
      padding-right: 20px;
      &-item {
        padding: 8px 0 8px 4px;
        .#{$teamix-prefix}timeline-item-content {
          width: calc(100% - 30px);
        }
        .item-detail {
          .name-time {
            display: flex;
            align-items: center;
            justify-content: space-between;
            .user-name {
              text-align: left;
              line-height: 20px;
              font-size: 14px;
              color: $gray-08;
              font-weight: bold;
              display: flex;
              .reply-btn {
                margin-left: 12px;
                text-align: left;
                line-height: 20px;
                font-size: 12px;
                cursor: pointer;
                color: $gray-06;
                &:hover {
                  color: $primary-brand;
                }
              }
            }
            .comment-time {
              text-align: right;
              line-height: 20px;
              font-size: 12px;
              color: $gray-06;
            }
          }
          .comment-note {
            text-align: left;
            line-height: 20px;
            font-size: 14px;
            color: $gray-08;
            white-space: normal;
            word-break: break-word;
            font-weight: normal;
          }
        }
      }
    }
  }
  .commit-comment-bottom-wrapper {
    position: relative;
    background: #fff;
    width: 440px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1px solid $gray-03;
    border-left: 1px solid $gray-03;
    box-shadow: -2px 0 4px 0 rgba(0, 0, 0, 0.1);
    transition: height 250ms;
    &.h190 {
      height: 190px;
    }
    &.h61 {
      height: 61px;
    }
    .text {
      text-align: left;
      line-height: 60px;
      width: 100%;
      padding-left: 20px;
      font-size: 14px;
      color: #a6a6a6;
      letter-spacing: 0;
      height: 60px;
    }
    .md {
      padding: 16px;
      font-size: 14px;
      width: 100%;
    }

    .draft-btn-wrapper {
      display: flex;
      justify-content: center;
      padding: 12px 0;
      height: 60px;
      .draft-btn {
        width: 360px;
        text-align: center;
      }
    }
  }
}
